<template>
  <div>
    <div style="margin: 30px 30px">
      <span style="margin-right: 20px">供应商</span>
      <el-select v-model="supplier" placeholder="选择供应商">
        <el-option label="联想成都分销公司" value="联想成都分销公司"></el-option>
        <el-option label="佳能成都分销公司" value="佳能成都分销公司"></el-option>
        <el-option label="成都飞达有限公司" value="成都飞达有限公司"></el-option>
        <el-option label="神州成都分销公司" value="神州成都分销公司"></el-option>
        <el-option label="飞利浦成都分销公司" value="飞利浦成都分销公司"></el-option>
        <el-option label="火箭成都分销公司" value="火箭成都分销公司"></el-option>
      </el-select>
      <span style="margin-left: 200px;margin-right: 10px">采购人</span>
      {{ this.buyer }}
    </div>

    <P style="margin-top: 50px;margin-bottom: 20px">采购物品</P>
    <el-table :data="tableData" border stripe header-cell-class-name="table-header">
      <el-table-column prop="purchaseName" label="商品名称"></el-table-column>
      <el-table-column prop="purchaseBrand" label="品牌"></el-table-column>
      <el-table-column label="采购价">
        <template #default="scope">
          <el-input v-model="scope.row.purchasePrice"
                    @change="changeNumber(scope.row)"></el-input>
        </template>
      </el-table-column>
      <el-table-column label="采购数量">
        <template #default="scope">
          <el-input v-model="scope.row.purchaseNumber"
                    @change="changeNumber(scope.row)"></el-input>
        </template>
      </el-table-column>
      <el-table-column label="操作">
        <template #default="scope">
          <el-button v-on:click="deleteById(scope.row.purchaseId)">
            移除商品
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <div style="margin-top: 60px">
      <el-button @click="dialogVisibleAdd=true"  style="margin-left: 270px;margin-right: 570px">添加商品</el-button>
      <el-button @click="deleteAll()">入库</el-button>
    </div>

    <!--添加商品-->
    <el-dialog v-model="dialogVisibleAdd" title="添加采购商品" width="30%">
      <el-form :model="addForm" ref="addForm">
        <el-form-item label="选择商品图片" prop="purchaseImg">
          <el-upload class="avatar-uploader"
                     action="/api/file/uploadAbsolutePo"
                     name="purchaseImg"
                     :on-success="handleSuccess"
                     :limit="2"
                     :on-change=handleChange
                     :before-upload="beforeAvatarUpload"
          >
            <img v-if="imageUrl" :src="imageUrl" class="avatar" style="width: 100px;height: 100px"/>
            <el-icon v-else class="avatar-uploader-icon">
              <Plus/>
            </el-icon>
          </el-upload>
        </el-form-item>
        <el-form-item label="商品编号" prop="code">
          <el-input v-model="addForm.code" @blur="selectByCode(addForm.code)"></el-input>
        </el-form-item>
        <el-form-item label="商品名称" prop="purchaseName">
          <el-input v-model="addForm.purchaseName"></el-input>
        </el-form-item>
        <el-form-item label="商品品牌" prop="purchaseBrand">
          <el-input v-model="addForm.purchaseBrand"></el-input>
        </el-form-item>
        <el-form-item label="类别" prop="purchaseType">
          <el-select v-model="addForm.purchaseType">
            <el-option label="电脑产品" value="1"></el-option>
            <el-option label="安防产品" value="2"></el-option>
            <el-option label="打印扫描设备" value="3"></el-option>
            <el-option label="办公耗材" value="4"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="采购数量" prop="purchaseNumber">
          <el-input v-model="addForm.purchaseNumber"></el-input>
        </el-form-item>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button type="primary" @click="cancel()">取消</el-button>
          <el-button type="primary" @click="add()">添加</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>

<script>
import axios from "axios";
import {ElMessage} from "element-plus";

export default {
  name: "purchase",
  created() {
    this.info()
    axios.post('/api/purchase/buyer',null).then(response=>{
      this.buyer = response.data
    })
  },
  data() {
    return {
      supplier: '',
      tableData: [],
      dialogVisibleAdd: false,
      addForm: {},
      imageUrl: '',
      buyer: '',
    }
  },
  methods: {
    info() {
      axios.get('/api/purchase/info', null).then(response => {
        this.tableData = response.data
      })
    },
    changeNumber(row) {
      axios.post('/api/purchase/changeNumber', row)
    },
    deleteById(id) {
      let param = new URLSearchParams();
      param.append("id", id)
      axios.post('/api/purchase/delete', param).then(response => {
        if ("删除成功" == response.data) {
          ElMessage.success('删除成功');
          this.info()
        } else {
          ElMessage.error('删除失败');
        }
      })
    },
    add() {
      let param = {
        code: this.addForm.code,
        purchaseName: this.addForm.purchaseName,
        purchaseBrand: this.addForm.purchaseBrand,
        purchaseType: this.addForm.purchaseType,
        purchaseNumber: this.addForm.purchaseNumber,
        purchaseImg: this.addForm.purchaseImg,
      }
      axios.post('/api/purchase/add', param).then(response => {
        this.$refs["addForm"].resetFields();
        this.dialogVisibleAdd = false;
        this.addForm.purchaseImg = ''
        this.imageUrl = ''
        this.info()
      })
    },
    selectByCode(code) {
      axios.get('/api/stock/selectByCode?code=' + code, null).then(response => {
        if (response.data.stockName!=null) {
          this.addForm.purchaseName = response.data.stockName
          this.addForm.purchaseBrand = response.data.stockBrand
          this.addForm.purchaseType = response.data.stockType.toString()
          this.imageUrl = 'http://localhost:8080/face/' + response.data.stockImg
          this.addForm.purchaseImg = response.data.stockImg
        }
      })
    },
    cancel() {
      this.$refs["addForm"].resetFields();
      this.dialogVisibleAdd = false;
      this.addForm.purchaseImg = ''
      this.imageUrl = ''
    },

    //入库
    deleteAll() {
      let param = {
        purchaseMesName: this.supplier,
        purchaseBuyer: this.buyer,
      }
      axios.post('/api/purchaseMes/add', param).then(response => {
        let purchaseMesId = response.data
        if (purchaseMesId > 0) {
          ElMessage({
            message: '入库成功',
            type: 'success',
          })
          let purchaseList = []
          let purchaseDetails = []
          let stockList = []
          axios.get('/api/purchase/info', null).then(response => {
            purchaseList = response.data
            purchaseList.forEach(p => {
              purchaseDetails.push({
                purchaseDetailsId: p.purchaseId,
                purchaseDetailsName: p.purchaseName,
                purchaseDetailsBrand: p.purchaseBrand,
                purchaseDetailsPrice: p.purchasePrice,
                purchaseDetailsNumber: p.purchaseNumber,
                fkPurchaseMesId: purchaseMesId
              })
            })
            purchaseDetails.forEach(p => {
              axios.post('/api/purchaseDetails/add', p)
            })
            purchaseList.forEach(p => {
              stockList.push({
                code:p.code,
                stockName:p.purchaseName,
                stockBrand:p.purchaseBrand,
                stockType:p.purchaseType,
                stockNumber:p.purchaseNumber,
                stockNewPrice:p.purchasePrice,
                stockImg:p.purchaseImg
              })
            })
            stockList.forEach(s=>{
              axios.post('/api/stock/add',s)
            })
            axios.get('/api/purchase/deleteAll', null).then(response=>{
              this.info()
              let param = new URLSearchParams();
              param.append("mes","成功入库")
              axios.post('/api/journal/add',param)
            })

          })
        }else {
          ElMessage.error('入库失败')
          this.info()
        }
      })
    },

    //上传文件
    handleSuccess(response) {
      this.imageUrl = 'http://localhost:8080/face/' + response
      this.addForm.purchaseImg = response
    },
    handleChange(file, fileList) {
      this.ebsFileList = fileList;
      this.ebsErrorImport = '';
      if (fileList.length > 1) {
        fileList.splice(0, 1);
      }
    },
  }
}
</script>

<style scoped>

</style>